<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="../css/spLeibiao.css">
    <script src="../js/axios.js"></script>
    <script src="../js/jquery.js"></script>
</head>

<body>

    <p></p>
    <!-- ----------头部---------- -->
    <header>
        <div>
            <a href="">
                <img src="https://img.alicdn.com/imgextra/i3/O1CN01vtLRi11W7QNiwWqpl_!!6000000002741-0-tps-1190-110.jpg"
                    alt="">
            </a>
        </div>
        <div>
            <div>
                <ul>
                    <li><a href="https://chaoshi.tmall.com/" target="_blank">天猫首页</a></li>
                    <li><em>喵，欢迎来天猫</em></li>
                    <li><a href="Login.html">请登录</a></li>
                    <li><a href="register.html">免费注册</a></li>
                    <li><a href="">网站无障碍</a></li>
                </ul>
                <ul>
                    <li>
                        <a href="">
                            我的淘宝
                            <b></b>
                        </a>
                        <ol>
                            <li> <a href="">已买到的宝贝</a> </li>
                            <li> <a href="">已卖出的宝贝</a> </li>
                        </ol>
                    </li>
                    <li><a href="../html/gwc.html">购物车</a></li>
                    <li>
                        <a href="">收藏夹
                            <b></b>
                        </a>
                        <ol>
                            <li> <a href="">收藏的宝贝</a> </li>
                            <li> <a href="">收藏的店铺</a> </li>
                        </ol>
                    </li>
                    <li><a href="">手机版</a>
                        <ol>
                            <img src="https://gw.alicdn.com/imgextra/i1/O1CN01p7gvna1wNcJUZjbyI_!!6000000006296-2-tps-175-175.png"
                                alt="">
                            <img src="	https://img.alicdn.com/tfs/TB1W.19bG67gK0jSZFHXXa9jVXa-145-30.jpg" alt="">
                        </ol>
                    </li>
                    <li><a href="">淘宝网</a></li>
                    <li>
                        <a href="">商家支持
                            <b></b>

                        </a>
                        <ol>
                            <li></li>
                            <li></li>
                        </ol>
                    </li>
                    <li>
                        <a href="">网站导航
                            <b></b>

                        </a>

                        <ol>
                            <li>
                                <p>热点推荐Hot</p>
                                <p>
                                    <span>天猫超市</span>
                                    <span>喵鲜生</span>
                                    <span>科技新品</span>
                                    <span>女装新品</span>
                                    <span>酷玩街</span>
                                </p>
                                <p>
                                    <span>天猫超市</span>
                                    <span>喵鲜生</span>
                                    <span>科技新品</span>
                                    <span>女装新品</span>
                                    <span>酷玩街</span>
                                </p>
                                <p>
                                    <span>天猫超市</span>
                                    <span>喵鲜生</span>
                                    <span>科技新品</span>
                                    <span>女装新品</span>
                                    <span>酷玩街</span>
                                </p>
                            </li>
                            <li>
                                <p>行业市场Market</p>
                                <p>
                                    <span>美妆</span>
                                    <span>电器</span>
                                    <span>女装</span>
                                    <span>男装</span>
                                    <span>女鞋</span>
                                </p>
                                <p><span>美妆</span>
                                    <span>电器</span>
                                    <span>女装</span>
                                    <span>男装</span>
                                    <span>女鞋</span></p>
                                <p><span>美妆</span>
                                    <span>电器</span>
                                    <span>女装</span>
                                    <span>男装</span>
                                    <span>女鞋</span></p>
                            </li>
                            <li>
                                <p>服务指南Help</p>
                                <p><span>帮助中心</span><span>品质保障</span></p>
                                <p><span>特色服务</span><span>7天退换货</span></p>
                            </li>
                        </ol>
                    </li>
                </ul>
            </div>

        </div>
    </header>
    <!-- ---------内容----------- -->
    <main>
        <div>
            <a href="">
                <img src="../img/index/logo.png">

            </a>
            <ol>
                <li>郑州</li>
                <li id="dizhi"></li>
            </ol>
            <div>
                <form action="">
                    <input type="text" value="搜索天猫超市商品">
                    <button>搜 索</button>
                </form>
            </div>
            <ul>
                <li>一站式购齐</li>
                <li>满88包邮</li>
                <img src="https://img.alicdn.com/tps/i1/TB1L25iFFXXXXXcbpXXgBrbGpXX-36-36.png" alt="">
                <img src="https://img.alicdn.com/tfs/TB1fc6SdKuSBuNjy1XcXXcYjFXa-36-36.png" alt="">
            </ul>
        </div>
        <div id="index-flexd">
            <b>
                <p>所有产品分类</p>
                <a href="index.html">首页</a>
                <i></i>
                <a href="">企业采购</a>
            </b>
            <ul>
                <li></li>
                <li>
                    <span id="index-jiage">￥0.00</span>
                    <span>元</span>
                    <span id="index-kg">0kg</span>
                </li>
                <li id="index-fenlei-gwc"></li>
            </ul>
        </div>
        <div>
            <div>
                <img src="https://gjusp.alicdn.com/img/img_1645180459433_47.gif@1000y-0+ic_60Q.gif" alt="">
                <img src="https://gjusp.alicdn.com/img/img_1645180489009_24.gif@1000y-0+ic_60Q.gif" alt="">
            </div>
            <div class="main-one" id="main-one">
                <img src="https://gw.alicdn.com/tfs/TB1RWrLokT2gK0jSZFkXXcIQFXa-360-144.png" alt="">
                <span class="splist-luoti-bt">
                    美味饮品
                </span>
                <img src="https://gw.alicdn.com/tfs/TB1RWrLokT2gK0jSZFkXXcIQFXa-360-144.png" alt="">
            </div>
            <ul id="spList">
            </ul>
            <div class="main-one" id="main-two">
                <img src="https://gw.alicdn.com/tfs/TB1RWrLokT2gK0jSZFkXXcIQFXa-360-144.png" alt="">
                <span class="splist-luoti-bt">
                    宅家零食
                </span>
                <img src="https://gw.alicdn.com/tfs/TB1RWrLokT2gK0jSZFkXXcIQFXa-360-144.png" alt="">
            </div>
            <ul id="spList1">
            </ul>
            <div class="main-one" id="main-two">
                <img src="https://gw.alicdn.com/tfs/TB1RWrLokT2gK0jSZFkXXcIQFXa-360-144.png" alt="">
                <span class="splist-luoti-bt">
                    个人护理
                </span>
                <img src="https://gw.alicdn.com/tfs/TB1RWrLokT2gK0jSZFkXXcIQFXa-360-144.png" alt="">
            </div>
            <ul id="spList2">
            </ul>
            <div class="main-one" id="main-two">
                <img src="https://gw.alicdn.com/tfs/TB1RWrLokT2gK0jSZFkXXcIQFXa-360-144.png" alt="">
                <span class="splist-luoti-bt">
                    爱宠用品
                </span>
                <img src="https://gw.alicdn.com/tfs/TB1RWrLokT2gK0jSZFkXXcIQFXa-360-144.png" alt="">
            </div>
            <ul id="spList3">
            </ul>
            <div class="main-one" id="main-two">
                <img src="https://gw.alicdn.com/tfs/TB1RWrLokT2gK0jSZFkXXcIQFXa-360-144.png" alt="">
                <span class="splist-luoti-bt">
                    家庭清洁
                </span>
                <img src="https://gw.alicdn.com/tfs/TB1RWrLokT2gK0jSZFkXXcIQFXa-360-144.png" alt="">
            </div>
            <ul id="spList4">
            </ul>
        </div>
        <div id="splist-luoti">
            <img src="../img/spLeibiao/2wm.png">
            <p>美味饮品</p>
            <p>宅家零食</p>
            <p>个人护理</p>
            <p>爱宠用品</p>
            <p>家庭清洁</p>
            <div></div>
        </div>
        <menu>
            <div>
                <div>
                    <img src="	https://gw.alicdn.com/tfs/TB1wr5SmUY1gK0jSZFMXXaWcVXa-336-120.png" alt="">
                    <img src="https://img.alicdn.com/tfs/TB1dl28RXXXXXbzaFXXXXXXXXXX-136-50.png" alt="">
                </div>
                <dl>
                    <dt>
                        <a href="">购物指南</a>
                    </dt>
                    <dd>
                        <a href="">购物流程</a>
                        <a href="">配送时效说明</a>
                        <a href="">配送区域及费用</a>
                        <a href="">购买生鲜须知</a>
                        <a href="">发票流程</a>
                        <a href="">商品限购说明</a>
                    </dd>
                </dl>
                <dl>
                    <dt>
                        <a href="">售后服务</a>
                    </dt>
                    <dd>
                        <a href="">退货规则</a>
                        <a href="">退货指南</a>
                        <a href="">保质期说明</a>
                        <a href="">联系客服</a>
                    </dd>
                </dl>
                <dl>
                    <dt>
                        <a href="">自助服务</a>
                    </dt>
                    <dd>
                        <a href="">订单物流查询</a>
                        <a href="">我的购物车</a>
                        <a href="">我的现金券</a>
                        <a href="">购物常见问题</a>
                        <a href="">建议反馈</a>
                    </dd>
                </dl>
                <dl>
                    <dt>
                        <a href="">商家服务</a>
                    </dt>
                    <dd>
                        <a href="">关于天猫超市</a>
                        <a href="">入驻天猫超市</a>
                        <a href="">商家常见问题</a>
                    </dd>
                </dl>
                <dl>
                    <dt>
                        <a href="">随时随地逛</a>
                    </dt>
                    <dd>
                        <a href="">
                            <img src="https://gtms03.alicdn.com/tps/i3/T1zuSAFRJbXXaSJVsE-115-115.png" alt="">
                        </a>
                    </dd>
                </dl>
            </div>
        </menu>
    </main>
    <!-- -------------尾部--------- -->
    <footer>
        <p>
            <a href="">关于天猫</a><a href="">商家服务大厅</a><a href="">开放平台</a><a href="">诚聘英才</a><a href="">联系我们</a><a
                href="">网站合作</a><a href="">法律声明</a><a href="">隐私权政策</a><a href="">知识产权</a><a href="">廉正举报</a><a
                href="">不当竞争举报</a>
        </p>
        <p>
            <a href="">阿里巴巴集团</a> |
            <a href="">淘宝网</a> |
            <a href="">天猫</a> |
            <a href="">聚划算</a> |
            <a href="">全球速卖通</a> |
            <a href="">阿里巴巴国际交易市场</a> |
            <a href="">1688</a> |
            <a href="">阿里妈妈</a> |
            <a href="">飞猪</a> |
            <a href="">阿里云计算</a> |
            <a href="">阿里云计算</a> |
            <a href="">阿里通信</a> |
            <a href="">万网</a> |
            <a href="">高德</a> |
            <a href="">UC</a> |
            <a href="">友盟</a> |
            <a href="">虾米</a> |
            <a href="">钉钉</a> |
            <a href="">支付宝</a> |
            <a href="">阿里安全</a>
        </p>
        <div>
            <a href="">增值电信业务经营许可证：浙B2-20110446</a>
            <a href="">市场名称登记证：工商网市字3301004119号</a>
            <a href=""> 出版物网络交易平台服务经营备案证： 新出发浙备字第2019002号</a><br>
            <a href="">互联网违法和不良信息举报电话：0571-81683755 jubao.tb@service.taobao.com</a>
            <a href=""> 中国互联网举报中心</a>
            <a href="">中国扫黄打非网</a>
            <a href="">全国文化和旅游市场网上举报投诉处理系统</a>
            <a href="">全国12315平台</a><br>
            <a href="">浙江省互联网违法和不良信息举报中心</a>
            <a href="">全网举报</a>
            <a href="">互联网药品信息服务资质证书编号：浙-（经营性）-2017-0005</a>
            <a href=""> <img src="	https://img.alicdn.com/tps/TB1yEqRPXXXXXXPXpXXXXXXXXXX-20-20.png"> 浙公网安备
                33010002000120号</a><br>
            <a href="">医疗器械网络交易服务第三方平台备案：（浙）网械平台备字[2018]第00002号</a>
            <a href="">网络文化经营许可证：浙网文 [2021]1668-073号 <img
                    src="	https://img.alicdn.com/imgextra/i3/O1CN01VEHhJi1T2RCHFYS81_!!6000000002324-1-tps-65-70.gif">
            </a><br>
            <a href="">浙江省网络食品销售第三方平台提供者备案：浙网食A33010002</a>
            <a href="">12318举报</a>
            <a href="">浙B2-20110446-1</a><br>
            <a href="" style="color: #686868;">© 2003-现在 TMALL.COM 版权所有</a><br><br>
            <a href=""><img
                    src="	https://img.alicdn.com/imgextra/i4/O1CN01rjCXEO1yXoR5lsMZO_!!6000000006589-0-tps-198-40.jpg"></a>
            <a href=""><img
                    src="https://img.alicdn.com/imgextra/i3/O1CN01Tr5MzE1FrMdQVXJbC_!!6000000000540-2-tps-238-40.png"></a>
            <a href=""><img
                    src="https://img.alicdn.com/imgextra/i3/O1CN01HkVitO1V8VhPKSICa_!!6000000002608-2-tps-174-40.png"></a>
            <a href=""><img
                    src="https://img.alicdn.com/imgextra/i1/O1CN01y1sR2j1iIfUL4VsKq_!!6000000004390-2-tps-202-40.png"></a>
            <a href="https://jubao.taobao.com/?spm=a3204.7084713.a2226n1.92.elKV2s"><img
                    src="https://img.alicdn.com/imgextra/i3/O1CN01WRHxRD1HlWox5UNuN_!!6000000000798-2-tps-99-40.png"></a>
        </div>

    </footer>
    <script>
        axios.get('http://jx.xuzhixiang.top/ap/api/allproductlist.php', {
            params: {
                uid: "133850"
            }
        }).then((ret) => {
            let aaa = ret.data.data
            let arr = aaa.map(v => `
            <li>
                <a href="xiangqingye.html?oid=${v.pid}"><img src="${v.pimg}" alt=""></a>
                    <p style=" margin-top: 20px; text-indent: 2em; ">${v.pname}</p>
                    <p ><span style=" color: red; font-style: normal; font-size: 12px; margin-left: 30px;"><i>￥</i>${v.pprice}</span><span style="display: inline-block;width: 28px; height:28px; border-radius: 50%; background-color: red;   text-align: center;margin-top: 40px;
    cursor: pointer;
                    line-height: 28px;color: khaki;font-size: 16px; margin-left: 120px;" data-od="${v.pid} " class="spLeibiao-addgwc" >></span></p>
             </li>

             `)
            document.querySelector("#spList").innerHTML = arr.join("")
            document.querySelector("#spList1").innerHTML = arr.join("")
            document.querySelector("#spList2").innerHTML = arr.join("")
            document.querySelector("#spList3").innerHTML = arr.join("")
            document.querySelector("#spList4").innerHTML = arr.join("")
            $(".spLeibiao-addgwc").each(function (i, ele) {
                $(".spLeibiao-addgwc").eq(i).click(function () {
                    // console.log($(this).attr("data-od"));
                    axios.get('http://jx.xuzhixiang.top/ap/api/add-product.php', {
                        params: {
                            uid: "133850",
                            pid: $(this).attr("data-od"),
                            pnum: "1"
                        }
                    }).then((ret) => {
                        console.log(ret.data)
                    })
                })
            })
        })
        $(function () {
            let flag = true;
            $(window).scroll(function () {
                let st = $(this).scrollTop()
                if (st >= 400) {
                    $("#splist-luoti").fadeIn()

                } else {
                    $("#splist-luoti").fadeOut()
                }
                if (flag) {

                    $(".splist-luoti-bt").each(function (i, ele) {
                        if ($(document).scrollTop() >= $(ele).offset().top - $(ele)
                            .outerHeight() *
                            0.1
                        ) {
                            $("#splist-luoti p").eq(i).addClass("splist-luoti-s1")
                                .siblings()
                                .removeClass()
                        }
                    })
                }

            })
            $("#splist-luoti p").click(function () {
                flag = false;
                let index = $(this).index() - 1;
                let cus = $(".splist-luoti-bt").eq(index).offset().top;
                $("html,body").stop().animate({
                    scrollTop: cus
                }, function () {
                    flag = true
                })
                $(this).addClass("splist-luoti-s1").siblings().removeClass()
            })
            $("#splist-luoti div").click(function () {
                $(window).scrollTop(0)
            })
            $(window).scroll(function () {
                let guTop = $("#index-flexd").offset().top
                let st = $(this).scrollTop()
                if (st >= 222) {
                    $("#index-flexd").css({
                        "position": "fixed",
                        "top": "0px",
                        "left": "164.6px",
                        "z-index": "9"

                    })
                } else {
                    $("#index-flexd").css({
                        "position": "",
                    })
                }
            })
        })
    </script>
</body>

</html>